<template>
  <j-modal :footer="null"
    :title="title"
    :width="1200"
    :visible="visible"
    :maskClosable="false"
    :fullscreen="false"
    @ok="handleOk"
    :okButtonProps="{ class:{'jee-hidden': disableSubmit} }"
    @cancel="handleCancel"  :containerFlag="true">
    <a-row >
      <a-col :span="24" style="text-align: center" v-if="!recommendInfo.groupFlag && recommendInfo.recommendFlag">
        您已经设置推荐专家，请等待所有专家推荐后即可开始投标
      </a-col>
      <a-col span="5">
        签到状态：<span style="font-weight: bold" v-if="signFlag">已签到</span>
        <a-button v-else @click="sign">签到</a-button>
      </a-col>
      <a-col span="18">
        <h3 v-if="!recommendInfo.recommendFlag && recommendInfo.cycle != 1">存在推荐票数相同的专家，请重新进行第{{recommendInfo.cycle}}次组长推荐</h3>
        <h3 v-if="recommendInfo.recommendFlag && recommendInfo.cycle != 1">第{{recommendInfo.cycle}}次组长推荐</h3>
        <a-table rowKey="id" bordered size="middle" :columns="columns" :dataSource="dataSource" :pagination="false">
          <div slot="action" slot-scope="text, record">
            <a-button v-if="!recommendInfo.recommendFlag" @click="setRecommend(record.expertId)" type="link" size="small">推荐</a-button>
            <span v-if="record.recommendFlag">已设置推荐</span>
          </div>
        </a-table>
      </a-col>
    </a-row>
    <review-modal ref="modalForm"></review-modal>
    <SignModal ref="signModalRef"/>
  </j-modal>
</template>

<script>
import ReviewModal from '../ReviewModal'
import SignModal from './SignInfoModal'
import { httpAction, getAction } from '@/api/manage'
import { mapActions } from 'vuex';

export default {
  name: 'SignModal',
  components: {
    ReviewModal,
    SignModal
  },
  data () {
    return {
      title: '',
      width: 800,
      visible: false,
      disableSubmit: false,
      columns: [
        {
          title: '专家姓名',
          align: 'center',
          dataIndex: 'expertName'
        },
        {
          title: '操作',
          dataIndex: 'action',
          align: 'center',
          width: 147,
          scopedSlots: { customRender: 'action' }
        }],
      dataSource: [
      ],
      url: {
        sign: '/exPingbiao/exPingbiaoExpert/sign',
        querySignInfo: '/exPingbiao/exPingbiaoExpert/querySignInfo',
        queryExpertList: '/exPingbiao/exPingbiaoExpert/expertList',
        setRecommend: '/exPingbiao/exPingbiaoExpert/setRecommend',
        recommendInfo: '/exPingbiao/exPingbiaoExpert/recommendInfo',

      },
      sectionInfo: {},
      signFlag: false,
      recommendInfo:{}
    }
  },
  methods: {
    ...mapActions(['showLoading', 'hideLoading']),
    showModal (record) {
      this.visible = true
      console.log(record)
      this.sectionInfo = record
      this.querySignInfo()
      this.queryExpertList()
    },
    querySignInfo () {
      var that = this
      getAction(this.url.querySignInfo, { sectionId: this.sectionInfo.id })
        .then((res) => {
          this.signFlag = res.result
        })
        .finally(() => {
          that.confirmLoading = false
        })
    },
    sign () {
      var that = this
      this.showLoading();
      getAction(this.url.sign, { sectionId: this.sectionInfo.id })
        .then((res) => {
          this.$message.success('签到成功')
          this.querySignInfo()
          this.queryExpertList()
        })
        .finally(() => {
          that.hideLoading()
          that.confirmLoading = false
        })
    },
    queryExpertList () {
      var that = this
      getAction(this.url.recommendInfo, { sectionId: this.sectionInfo.id })
        .then((res) => {
          this.recommendInfo = res.result
          this.dataSource = res.result.expertList
          if (this.recommendInfo.groupFlag && this.sig) {
            this.closeAndShowModal();
          }
        })
        .finally(() => {
          that.confirmLoading = false
        })
    },
    setRecommend (recommendExpertId) {
      if(!this.signFlag){
        this.$message.error('您还未签到，无法设置推荐专家')
        return;
      }
      this.showLoading();
      var that = this
      getAction(this.url.setRecommend, { sectionId: this.sectionInfo.id, recommendExpertId })
        .then((res) => {
          this.queryExpertList()
        })
        .finally(() => {
          that.hideLoading()
          that.confirmLoading = false
        })
    },
    closeAndShowModal () {
      this.$emit('closeAndShowModal', this.sectionInfo)
      this.visible = false
    },
    close () {
      this.$emit('close')
      this.visible = false
    },
    handleOk () {
      this.$refs.realForm.handleOk()
    },
    submitCallback () {
      this.$emit('ok')
      this.visible = false
    },
    handleCancel () {
      this.$emit('ok')
      this.close()
    }
  }
}
</script>

<style scoped>
</style>
